<!--
  -    Copyright (c) 2018-2025, lengleng All rights reserved.
  -
  - Redistribution and use in source and binary forms, with or without
  - modification, are permitted provided that the following conditions are met:
  -
  - Redistributions of source code must retain the above copyright notice,
  - this list of conditions and the following disclaimer.
  - Redistributions in binary form must reproduce the above copyright
  - notice, this list of conditions and the following disclaimer in the
  - documentation and/or other materials provided with the distribution.
  - Neither the name of the pig4cloud.com developer nor the names of its
  - contributors may be used to endorse or promote products derived from
  - this software without specific prior written permission.
  - Author: lengleng (wangiegie@gmail.com)
  -->
<template>
	<div class="layout-padding">
		<div class="layout-padding-auto layout-padding-view" style="overflow-y: scroll">
			<div class="execution">
				<basic-container>
					<avue-crud
						ref="crud"
						v-model="form"
						v-model:page="page"
						:data="tableData"
						:table-loading="tableLoading"
						:option="tableOption"
						:before-open="handleOpenBefore"
						:permission="permissionList"
						@on-load="getList"
						@search-change="searchChange"
						@refresh-change="refreshChange"
						@size-change="sizeChange"
						@current-change="currentChange"
						@row-update="handleUpdate"
						@row-save="handleSave"
						@row-del="rowDel"
						@search-reset="resetsearch"
					>
						<!-- <template #devName-search="{ disabled, size }">
							<el-input clearable v-model="devName" placeholder="请输入 设备名称"></el-input>
						</template> -->
						<!-- <template #systemName-form>
							<avue-input-tree
								checkStrictly
								filterable
								placeholder="请选择 系统名称"
								:dic="treeData"
								:props="treeDataProps"
								v-model="form.systemName"
								@change="zclmSearch"
							></avue-input-tree>
						</template> -->
						<!-- <template #unmodel-form>
							<avue-select
								placeholder="请选择 资产类型"
								filterable
								:dic="scarchOptions"
								:props="typeProps"
								v-model="form.unmodel"
								@change="zclxSearch"
							></avue-select>
						</template> -->
						<template #menu-left="{}">
							<el-button class="filter-item" plain type="primary" icon="el-icon-upload" @click="$refs.excelUpload.show()">导入 </el-button>
						</template>
						<template #typeName-form>
							<avue-select
								ref="select1"
								v-model="form.typeName"
								:dic="productList"
								:props="devProps"
								@change="zcxhSearch"
								filterable
								multiple
								placeholder="产品"
							></avue-select>
						</template>
						<template #devName-form>
							<avue-select
								ref="select1"
								v-model="form.devName"
								:dic="equipmentList"
								:props="devEquipment"
								@change="zcxhSearch1"
								filterable
								all
								multiple
								placeholder="设备列表"
							></avue-select>
						</template>
						<!-- <template #devName-form>
							<avue-select
								ref="select"
								v-model="form.devName"
								:dic="devList"
								:props="devOptions"
								multiple
								placeholder="请选择 设备名称"
							></avue-select>
						</template> -->
					</avue-crud>
					<!--excel 模板导入 -->
					<excel-upload
						ref="excelUpload"
						title="电表注册信息"
						url="/admin/devEnroll/import"
						temp-name="电表注册信息.xlsx"
						temp-url="/bm/sys-file/local/bumdevenroll.xlsx"
						@refreshDataList="refreshChange"
					>
					</excel-upload>
				</basic-container>
			</div>
		</div>
	</div>
</template>

<script>
// import { fetchList,  addObj, putObj, delObj,getBamSFloorCode } from '/@/api/basiciot/area/floor'
// import { getAllBuildings } from '/@/api/basiciot/area/buildings'
// import { tableOption } from '/@/crud/basiciot/area/floor'
import { getAuthBtnList } from '/@/utils/btnpermissions';

import {
	getModelList,
	addModelList,
	delModelList,
	getAllAssetsType,
	getAssetsCloumTree,
	getAllAssetsModel,
	getDevInfo,
	getProduct,
	editModelList,
} from '/@/api/powerdistribution/electricity/equipmentRegister';
import ExcelUpload from '/@/components/ExcelUpload/index.vue';

import other from '/@/utils/other';

export default {
	name: 'bamfloor',
	components: { ExcelUpload },
	data() {
		return {
			searchForm: {},
			searchFloorPid: '',
			tableData: [],
			page: {
				total: 0, // 总页数
				currentPage: 1, // 当前页数
				pageSize: 10, // 每页显示多少条
			},
			tableLoading: false,
			tableOption: {
				border: true,
				searchMenuSpan: 6,
				searchLabelWidth: 'auto',
				searchMenuPosition: 'left',
				addBtn: true,
				delBtn: true,
				emptyBtn: false,
				labelWidth: 130,
				columnBtn: false,
				gridBtn: false, // 卡片模式切换按钮
				column: [
					// {
					// 	label: '系统名称',
					// 	hide: true,
					// 	type: 'select',
					// 	prop: 'systemName',
					// 	editDisplay: false,
					// 	rules: [
					// 		{
					// 			required: true,
					// 			trigger: 'blur',
					// 			message: '系统名称必填',
					// 		},
					// 	],
					// },
					// {
					// 	type: 'select',
					// 	label: '资产类型',
					// 	hide: true,
					// 	prop: 'unmodel',
					// 	editDisplay: false,
					// 	rules: [
					// 		{
					// 			required: true,
					// 			trigger: 'blur',
					// 			message: '类型名称必填',
					// 		},
					// 	],
					// },
					{
						type: 'select',
						label: '产品',
						prop: 'typeName',
						search: false,
						// hide: true,
						editDisplay: true,
						rules: [
							{
								required: true,
								trigger: 'blur',
								message: '产品必填',
							},
						],
					},
					// {
					// 	type: 'select',
					// 	label: '产品',
					// 	prop: 'typeName',
					// 	addDisplay: false,
					// 	editDisplay: false,
					// 	width: 200,
					// 	overHidden: true,
					// },
					{
						type: 'select',
						label: '设备列表',
						search: false,
						prop: 'devName',
						editDisplay: true,
						overHidden: true,
						rules: [
							{
								required: true,
								trigger: 'blur',
								message: '设备列表必填',
							},
						],
					},
					// {
					//   type: 'select',
					//   label: '变配电设备类型',
					//   clearable: true,
					//   editDisplay: false,
					//   dicUrl:'/om/omodict/item/select?dictKey=electricity_equipmentType',
					//   search: true,
					//   prop: 'devCategories',
					//   overHidden: true,
					//   rules: [
					//     {
					//       required: true,
					//       trigger: 'blur',
					//       message: '变配电设备类型必填'
					//     }
					//   ]
					// },
					{
						type: 'input',
						label: '备注',
						prop: 'remark',
						span: 24,
					},
					{
						type: 'date',
						label: '创建时间',
						width: 180,
						addDisplay: false,
						editDisplay: false,
						prop: 'createTime',
					},
				],
			},
			buildingsOptions: [],
			buildingsProps: {
				label: 'buildingsCn',
				value: 'buildingsId',
			},
			devProps: {
				label: 'name',
				value: 'productKey',
			},
			devEquipment: {
				label: 'deviceName',
				value: 'unitNo',
			},
			form: {
				typeName: [],
				devName: [],
			},
			dic: {},
			last_unitno: '',
			front_unitno: '',
			isupdate: true,
			productList: [],
			equipmentList: [],
		};
	},
	mounted() {
		// getAllBuildings({}).then(res => {
		// 	this.buildingsOptions = res.data
		// 	this.dic = new Map()
		// 	res.data.forEach(d => {
		// 		this.dic.set(d.buildingsId, d.buildingsCn)
		// 	})
		// })
	},
	computed: {
		// permissions() {
		// 	return {
		// 		devEnroll_view: getAuthBtnList('devEnroll_view'),
		// 		devEnroll_add: getAuthBtnList('devEnroll_add'),
		// 		devEnroll_edit: getAuthBtnList('devEnroll_edit'),
		// 		devEnroll_del: getAuthBtnList('devEnroll_del'),
		// 		devEnroll_import: getAuthBtnList('devEnroll_import'),
		// 	};
		// },
		permissionList() {
			return {
				viewBtn: getAuthBtnList('devEnroll_view'),
				addBtn: getAuthBtnList('devEnroll_add'),
				editBtn: getAuthBtnList('devEnroll_edit'),
				delBtn: getAuthBtnList('devEnroll_del'),
				importBtn: getAuthBtnList('devEnroll_import'),
			};
		},
	},
	methods: {
		// zclmSearch(data) {
		// 	this.form.unmodel = '';
		// 	this.form.devType = [];
		// 	this.scarchOptions = [];
		// 	this.szcxhOptions = [];
		// 	if (data.value) {
		// 		// let cxdata = {};
		// 		// if (data.value.length > 4) {
		// 		// 	cxdata.bamAssetsTypeMcode = data.value;
		// 		// } else {
		// 		// 	cxdata.bamAssetsTypeScode = data.value;
		// 		// }
		// 		// getAllAssetsType(cxdata).then((res) => {
		// 		// 	this.scarchOptions = res.data.data;
		// 		// });
		// 		let modeldata = {};
		// 		modeldata.cloumnCode = data.value;
		// 		getAllAssetsModel(modeldata).then((res) => {
		// 			this.szcxhOptions = res.data.data;
		// 		});
		// 	}
		// },
		// zclxSearch(data) {
		// 	this.szcxhOptions = [];
		// 	this.form.devType = [];
		// 	if (data.value) {
		// 		let modeldata = {};
		// 		modeldata.typeCode = data.value;
		// 		getAllAssetsModel(modeldata).then((res) => {
		// 			this.szcxhOptions = res.data.data;
		// 		});
		// 	}
		// },
		// 产品
		zcxhSearch(data) {
			let obj = {
				size: 999,
			};
			getDevInfo(obj).then((res) => {
				this.productList = res.data.records;
				// console.log(this.productList, 'this.productList');
			});
			if (this.form.id == undefined) {
				if (data.item === undefined) {
					this.equipmentList = [];
				} else {
					// console.log(data.value.join(','), 'wwwwww');
					getProduct({ productKey: data.value.join(',') }).then((res1) => {
						// console.log(res1, 'res1数据');
						this.equipmentList = res1.data;
					});
				}
			} else {
				getProduct({ productKey: this.form.devType }).then((res1) => {
					// console.log(res1, 'res1数据');
					this.equipmentList = res1.data;
				});
			}
		},
		zcxhSearch1(val) {
			console.log(val, 'aaaaaaaaaaaaa');
		},
		resetsearch() {
			console.log('llllllllllll');
		},
		handleOpenBefore(done, type) {
			console.log('pppppp');
			// form: {
			// 	typeName: [],
			// 	devName: [],
			// },

			this.form.typeName = [];
			this.form.devName = [];
			done();
		},
		getList(page, params) {
			// this.tableLoading = true
			getModelList(
				Object.assign(
					{
						current: page.currentPage,
						size: page.pageSize,
					},
					params,
					this.searchForm
				)
			).then((res) => {
				this.tableData = res.data.records;
				this.page.total = res.data.total;
				this.tableLoading = false;
			});
		},
		rowDel: function (row, index) {
			this.$confirm('是否确认删除该数据？', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning',
			})
				.then(function () {
					return delModelList(row.id);
				})
				.then((data) => {
					this.$message.success('删除成功');
					this.getList(this.page);
				})
				.catch((cancelorerror) => {});
		},
		handleUpdate: function (row, index, done, loading) {
			editModelList(row)
				.then((data) => {
					this.$message.success('修改成功');
					done();
					this.getList(this.page);
				})
				.catch(() => {
					loading();
				});
		},
		handleSave: function (row, done, loading) {
			// console.log(this.form, '保存数据this.form');
			// console.log(row, '保存数据');
			let arr = [];
			// let o = this.szcxhOptions.find((item) => {
			// 	return item.bamAAssetsDeviceCode === row.devType;
			// });
			this.equipmentList.forEach((item) => {
				// console.log(item, 'item数据');
				row.devName.forEach((item1) => {
					// console.log(item1, 'item11111数据');
					if (item1 == item.unitNo) {
						arr.push({
							devName: item.deviceName,
							unitNo: item.unitNo,
							typeName: item.productName,
							devType: item.productKey,
							remark: row.remark,
						});
					}
				});
			});
			// console.log(arr,"arr")
			// let arr = []
			addModelList(arr)
				.then((data) => {
					this.$message.success('添加成功');
					done();
					this.getList(this.page);
				})
				.catch(() => {
					loading();
				});
		},
		sizeChange(pageSize) {
			this.page.pageSize = pageSize;
		},
		currentChange(current) {
			this.page.currentPage = current;
		},
		searchChange(form, done) {
			this.page.currentPage = 1;
			this.getList(this.page, { ...form, devName: this.devName });
			done();
		},
		refreshChange() {
			this.getList(this.page);
		},

		handleRefreshChange() {
			this.getList(this.page);
		},
		exportExcel() {
			// other.downBlobFile(other.adaptationUrl('/admin/accessFloor/export'), this.searchForm, '楼层信息.xlsx');
		},
	},
};
</script>
<style lang="scss" scoped>
.span-title {
	display: flex;
	background: rgb(226, 219, 219);
	border-radius: 4px;

	.span-label {
		padding-left: 10px;
		color: #fff;
		height: 36px;
		flex: 2;
	}

	.span-input {
		flex: 2;
	}
}
</style>
